<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
  <title>template: home</title>
  <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

  <!-- **** layout stylesheet **** -->
  <link rel="stylesheet" type="text/css" href="style/style.css" />

  <!-- **** colour scheme stylesheet **** -->
  <link rel="stylesheet" type="text/css" href="style/colour.css" />

</head>

<body>
  <div id="main">
    <div id="header">
      <div id="logo"><h1>company logo goes here</h1></div>
      <div id="address"><p>company name<br />company address 1, company address 2, company address 3<br />tel: 0101 010 010</p></div>
    </div>
    <div id="menu">
      <ul>
        <!-- **** INSERT NAVIGATION ITEMS HERE (use id="selected" to identify the page you're on **** -->
        <li><a id="selected" href="#">welcome</a></li>
        <li><a href="#">page 1</a></li>
        <li><a href="#">page 2</a></li>
        <li><a href="#">page 3</a></li>
        <li><a href="#">contact us</a></li>
      </ul>
      <div id="links">
        <!-- **** INSERT LINKS HERE **** -->
        <a href="#"><img src="style/home.png" alt="home" /></a>&nbsp;<a href="#"><img src="style/email.png" alt="contact us" /></a>
      </div>
    </div>
    <div class="sidebar">
      <div class="sidebaritem">
        <!-- rounded corners - top **** -->
        <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
        <h1>latest news</h1>
        <!-- **** INSERT NEWS ITEMS HERE **** -->
        <h2>01.09.2006</h2>
        <p>This is where you can put your latest news.</p>
        <p><a href="#">read more ...</a></p>
        <p></p>
        <h2>01.09.2006</h2>
        <p>This is where you can put your latest news.</p>
        <p><a href="#">read more ...</a></p>
        <!-- rounded corners - bottom **** -->
        <div class="rbottom"><div class="r4"></div><div class="r3"></div><div class="r2"></div><div class="r1"></div></div>
      </div>
      <div class="sidebaritem">
        <!-- rounded corners - top **** -->
        <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
        <h1>additional links</h1>
        <div class="sbilinks">
          <!-- **** INSERT ADDITIONAL LINKS HERE **** -->
          <ul>
            <li><a href="http://www.opendesigns.org">open designs</a></li>
            <li><a href="http://www.w3schools.com/xhtml/default.asp">learn XHTML</a></li>
            <li><a href="http://www.w3schools.com/css/default.asp">learn CSS</a></li>
            <li><a href="http://www.mozilla.com/firefox">get firefox</a></li>
          </ul>
        </div>
        <!-- rounded corners - bottom **** -->
        <div class="rbottom"><div class="r4"></div><div class="r3"></div><div class="r2"></div><div class="r1"></div></div>
      </div>
      <div class="sidebaritem">
        <!-- rounded corners - top **** -->
        <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
        <h1>other information</h1>
        <!-- **** INSERT OTHER INFORMATION HERE **** -->
        <p>
          This space can be used for additional information such as a contact phone number, address
          or maybe even a graphic.
        </p>
        <!-- rounded corners - bottom **** -->
        <div class="rbottom"><div class="r4"></div><div class="r3"></div><div class="r2"></div><div class="r1"></div></div>
      </div>
    </div>
    <div id="content">
      <h1>Introduction</h1>
      <!-- **** INSERT PAGE content_container HERE **** -->
      <p>
        This website template is released as an 'open source' design (under the
        <a href="http://creativecommons.org/licenses/by/2.5"> Creative Commons
        Attribution 2.5</a> licence), which means that you are free to download and
        use it for anything you want (including modifying and amending it).
        All I ask is that you leave the 'design by dcarter' link in the footer of the
        template, but other than that...
      </p>
      <p>
        The css curved edges are based on <a href="http://www.html.it/articoli/nifty/index.html">
        Nifty Corners</a> (rounded corners without images By Alessandro Fulciniti).
      </p>
      <p>
        This standards compliant template is written entirely in XHTML 1.1 and CSS,
        and can be validated using the links in the footer.
      </p>
      <p>
        You can view my other 'open source' template designs
        <a href="http://www.dcarter.co.uk/templates.html">here</a>.
      </p>
      <h1>Example Elements</h1>
      <h2>Bold Text</h2>
      <p><strong>this is an example of bold text</strong></p>
      <h2>Italics</h2>
      <p><i>this is an example of italic text</i></p>
      <h2>Links</h2>
      <p><a href="index.html">this is an example link</a></p>
      <h2>Block Quotes</h2>
      <blockquote>
        <p>
          Some blockquote text. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
          incididunt ut labore et dolore magna aliqua.
        </p>
      </blockquote>
      <h2>Unordered Lists</h2>
      <ul>
        <li>list item 1</li>
        <li>list item 2</li>
      </ul>
      <br />
      <h2>Ordered Lists</h2>
      <ol>
        <li>list item 1</li>
        <li>list item 2</li>
      </ol>
      <br />
      <h2>Images</h2>
      <p>images can be placed on the left, in the center or on the right.</p>
      <span class="left"><img src="style/graphic.jpg" alt="example graphic" /></span>
      <p>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
        incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
        exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
        irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
        pariatur.
      </p>
      <span class="center"><img src="style/graphic.jpg" alt="example graphic" /></span>
      <span class="right"><img src="style/graphic.jpg" alt="example graphic" /></span>
      <p>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
        incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
        exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
        irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
        pariatur.
      </p>
    </div>
    <div class="sidebar">
      <div class="sidebaritem">
        <!-- rounded corners - top **** -->
        <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
        <h1>latest news</h1>
        <!-- **** INSERT NEWS ITEMS HERE **** -->
        <h2>01.09.2006</h2>
        <p>This is where you can put your latest news.</p>
        <p><a href="#">read more ...</a></p>
        <p></p>
        <h2>01.09.2006</h2>
        <p>This is where you can put your latest news.</p>
        <p><a href="#">read more ...</a></p>
        <!-- rounded corners - bottom **** -->
        <div class="rbottom"><div class="r4"></div><div class="r3"></div><div class="r2"></div><div class="r1"></div></div>
      </div>
      <div class="sidebaritem">
        <!-- rounded corners - top **** -->
        <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
        <h1>additional links</h1>
        <div class="sbilinks">
          <!-- **** INSERT ADDITIONAL LINKS HERE **** -->
          <ul>
            <li><a href="http://www.opendesigns.org">open designs</a></li>
            <li><a href="http://www.w3schools.com/xhtml/default.asp">learn XHTML</a></li>
            <li><a href="http://www.w3schools.com/css/default.asp">learn CSS</a></li>
            <li><a href="http://www.mozilla.com/firefox">get firefox</a></li>
          </ul>
        </div>
        <!-- rounded corners - bottom **** -->
        <div class="rbottom"><div class="r4"></div><div class="r3"></div><div class="r2"></div><div class="r1"></div></div>
      </div>
      <div class="sidebaritem">
        <!-- rounded corners - top **** -->
        <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
        <h1>other information</h1>
        <!-- **** INSERT OTHER INFORMATION HERE **** -->
        <p>
          This space can be used for additional information such as a contact phone number, address
          or maybe even a graphic.
        </p>
        <!-- rounded corners - bottom **** -->
        <div class="rbottom"><div class="r4"></div><div class="r3"></div><div class="r2"></div><div class="r1"></div></div>
      </div>
    </div>
    <div id="footer">
      copyright &copy; company name | <a href="#">email@emailaddress</a> | <a href="http://validator.w3.org/check?uri=referer">XHTML 1.1</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a> | <a href="http://www.dcarter.co.uk">design by dcarter</a>
    </div>
  </div>
</body>
</html>
